import React from 'react';
import { withRouter } from 'umi';
import { createForm } from 'rc-form';
import MetaTags from 'react-meta-tags';
import EntryGuide from '@/pages/EntryManage/mobile/EntryGuide';
import { RecruitContext } from './Context';
import { Header, Steps } from './mobile/components';

import {
    Interview,
    InvalidPage,
    EliminatePage,
    InterviewHomeWork,
    InterviewOffer,
    InterviewCandidate,
    InterviewJoin
} from './mobile/containers';
import styles from './mobile.less';

const { Step } = Steps;

/**
 * 移动端背调
 */
function RecruitEmailMobile(props) {
    // eslint-disable-next-line @typescript-eslint/no-unused-vars
    const { data, steps, current, setCurrent, id, getTotalDesc, entryStatus, setEntryStatus } = props;
    const currentView = React.useMemo(() => {
        let view = null;
        switch (current) {
            case 0:
                if (data?.interviewWay === 5) {
                    view = <InterviewHomeWork id={id} nid={data?.interviewNoticeId} linkStep={data?.linkStep} />;
                } else {
                    view = <Interview id={id} nid={data?.interviewNoticeId} linkStep={data?.linkStep} />;
                }
                break;
            case 1:
                view = (
                    <InterviewCandidate
                        // backgroundNum={data?.backgroundNum}
                        needBackgroundFlag={data?.needBackgroundFlag}
                        id={id}
                        nid={data?.signCandidateId}
                        linkStep={data?.linkStep}
                    />
                );
                break;
            case 2:
                if (entryStatus === 'init') {
                    view = <InterviewOffer nid={data?.employId} id={id} />;
                } else if (data?.entryPersonnelCode) {
                    view = <InterviewJoin nid={data?.employId} id={id} getTotalDesc={getTotalDesc} />;
                }

                break;
            case 3:
                view = <EntryGuide entryPersonnelCode={data?.entryPersonnelCode} />;
                break;

            default:
                break;
        }
        return view;
    }, [current, data, entryStatus]);

    const setCurrentStep = val => {
        setCurrent(val);
        sessionStorage.setItem('__LETTER_STEP__', val);
    };
    return (
        <div className={styles.pageWrap}>
            <div style={{ position: 'relative' }}>
                <MetaTags>
                    <title>微微科技官网</title>
                    <meta name="keywords" content="微微科技官网" />
                    <meta name="description" content="微微科技官网" />
                    <meta
                        name="viewport"
                        content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no"
                    />
                </MetaTags>
                {/* 正常状态 */}
                {data && data.hasValid && !data.hasEliminate && (
                    <>
                        <div style={{ position: 'absolute', left: 0, top: 0, right: 0, zIndex: 99 }}>
                            <Header />
                            <Steps current={current} onChange={setCurrentStep}>
                                {steps.map((item, index) => (
                                    <Step key={item.title} title={item.title} disabled={index >= data?.linkStep} />
                                ))}
                            </Steps>
                        </div>
                        <div>
                            <RecruitContext.Provider value={{ ...props }}>{currentView}</RecruitContext.Provider>
                        </div>
                    </>
                )}
                {/* 淘汰状态 */}
                {data && data.hasValid && data.hasEliminate && (
                    <>
                        <Header />
                        <EliminatePage dutyName={data?.dutyName} />
                    </>
                )}
                {/* 链接失效状态 */}
                {data && !data.hasValid && (
                    <>
                        <Header style={{ background: '#fff' }} />
                        <InvalidPage data={data?.hrDetailVO} />
                    </>
                )}
            </div>
        </div>
    );
}

export default withRouter(createForm()(RecruitEmailMobile));
